<template>
	<div>
		<div id="mainChart" style="width: 100%; height: 450px">

		</div>
	</div>
</template>

<script>
	export default {
		name: "Index",
		mounted() {
			this.drawChart();
		},
		methods: {
			drawChart() {
				// 初始化echarts实例
				this.$nextTick(() => {
					let myChart = this.$echarts.init(document.getElementById("mainChart"));
					// 指定图表的配置项和数据
					let option = {
						title: {
							text: "ECharts",
						},
						tooltip: {},
						legend: {
							data: ["销量"],
						},
						xAxis: {
							data: ["a", "b", "c", "d", "e", "f"],
						},
						yAxis: {},
						series: [
							{
								name: "销量",
								type: "bar",
								data: [5, 20, 36, 10, 10, 20],
							},
						],
					};
					// 使用刚指定的配置项和数据显示图表
					myChart.setOption(option);
				})
				
			},

		}
	}
</script>

<style scoped>



</style>
